<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="pragma" content="no-cach" /> 
<meta http-equiv="cache-control" content="no-cache" /> 
<meta http-equiv="expires" content="0" />
<script src="../inc/jquery-2.0.3_code.js"></script>
<script src="../inc/doll_1.0.js"></script>
<script>
/*
$.doll.tool()
$(window).doll().fx();
$.doll().fx();
$(window).fxfx()
*/

$(function(){
     var video=$("#videoID").get(0);
	//$.doll._prof("#de",video);
	$("#pause").click(function(){
	     video.pause();	     
	})
 
	$("#play").click(function(){
		video.addTextTrack("dcdsfdsfdsfd")
	     video.play();	     
	})	
	
	$("#volume_").click(function(){
	     video.volume -= 0.1;	 
		 $("#volume").val(video.volume)       
	})	
	
	$("#volumeP").click(function(){
	     video.volume += 0.1;	
		 $("#volume").val(video.volume)     
	})
	
	$("#back").click(function(){
	     video.currentTime -= 10;	     
	})	
	
	$("#go").click(function(){
	     video.currentTime += 10;	     
	})	
	
	$("#rate_").click(function(){
	     video.playbackRate -= 0.1;	
		 
		 $("#rate").val(video.playbackRate)     
	})
	
	$("#rateP").click(function(){
	     video.playbackRate += 0.1;	  
		  $("#rate").val(video.playbackRate)   
	})
	
 	$("#muted").click(function(){
	     if(video.muted==true){
		    video.muted=false;
		 }else{
			video.muted=true; 
		 }     
	})	
	
	$("#full").click(function(){
	     video.webkitEnterFullscreen();
		 controls=null;
		 video.mozRequestFullscreen();
	})
	
})
</script>
<title>video</title>
<style>
#box{width:1272px;
margin:0px; padding:0px 320px 0px 320px;
}
</style>
</head>

<body>

 <div id="de">ds</div> 
<div id="box">
<video  
src      = "1.mp4" 
 controls = "controls" 
autoplay = "autoplay"  
width    = "1280" 
id       = "videoID"  
style    = "ime-mode:disabled;"
loop     = "loop"
preload  = "preload"
>

<track src="1.vtt" kind="subtitles" srclang="en" label="English subtitles">   
your browser does not support the video tag
</video>

<div>
<input name="" type="button" id="rate" value="">
<input name="" type="button" id="volume" value="">
<br>
<input name="" type="button" id="pause" value="pause">
<input name="" type="button" id="play" value="play">
<input name="" type="button" id="go" value="go">
<input name="" type="button" id="back" value="back">
<input name="" type="button" id="rate_" value="rate-">

<input name="" type="button" id="rateP" value="rate+">
<input name="" type="button" id="volume_" value="volume-">
<input name="" type="button" id="volumeP" value="volume+">
<input name="" type="button" id="muted" value="muted">
<input name="" type="button" id="full" value="full">
 
</div>

</div>

</body>
</html>